<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/login.css"/>
		<!-- 弹框 -->
	   <!-- <script type="text/javascript">
			window.onload = function(){
				
			var btn = document.querySelector("button");
			btn.onclick = function(){
			var box = document.querySelector(".box");
			box.style.display="flex";
			}
			
			var close = document.querySelector(".close");
			close.onclick = function(){
			var box = document.querySelector(".box");
			box.style.display="none";
			}
		}
		</script> -->
		<script type="text/javascript">
			window.onload=function(){
				var btns = document.querySelectorAll(".box .title a");
				var forms = document.querySelectorAll(".box .text form");
				for (var i = 0; i < btns.length; i++) {
					btns[i].onclick = function(){
						for (var j = 0; j < btns.length; j++) {
							btns[j].className = "";
						}
						this.className = "active";
						
						var idx = this.attributes["data-idx"].value;
						for (var j = 0; j < forms.length; j++) {
							forms[j].style.display="none";
						}
						forms[idx].style.display="block";
					}
				}
			}
		</script>
	</head>
	<body>
		<!-- <button type="button">显示登录框</button> -->
		<!-- <div class="box">
			<div class="content">
				<span class="close">&times;</span>
			</div>
		</div> -->
		<div class="content">
			<div class="box">
				<div class="right">
				<div class="title">
					<a href="#" class="active" data-idx="0">登录</a>
					<a href="#" data-idx="1">注册</a>
				</div>
				
				<div class="text">
				<form action="#" method="get">
					<div>
						<input type="text" name="name" id="name" placeholder="请输入手机号或邮箱">
					</div>
					<div>
						<input type="password" name="pwd" id="pwd" placeholder="请输入密码">
					</div>
					<div>
						<input type="checkbox" name="chk" id="chk" value="" />
						<label for="chk">自动登录</label>
					</div>
					<div>
						<input type="submit" name="" id="" value="登录" />
					</div>
				</form>
				
				<form action="#" method="get">
					<div>
						<input type="text" name="name" id="name" placeholder="请输入手机号或邮箱">
					</div>
					<div>
						<input type="password" name="pwd" id="pwd" placeholder="请输入密码">
					</div>
					<div>
						<input type="text" name="" id="yan" placeholder="请输入验证码"><button type="button">获取验证码</button>
					</div>
					<div>
						<input type="submit" name="" id="" value="立即注册" />
					</div>
					<div class="ty">
					<input type="checkbox" name="chk" id="chk" value="" />
						<label for="chk">我已阅读并同意《音悦Tai服务条款》</label>
					</div>
				</form>
				</div>
				</div>
			</div>
			
		</div>
	</body>
</html>
